<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
	<base href="<%=basePath%>">
	<meta charset="utf-8" />
	<title></title>
	<meta name="description" content="overview & stats" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<link href="static/css/bootstrap.min.css" rel="stylesheet" />
	<link href="static/css/bootstrap-responsive.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="static/css/font-awesome.min.css" />
	<!-- 下拉框 -->
	<link rel="stylesheet" href="static/css/chosen.css" />

	<link rel="stylesheet" href="static/css/ace.min.css" />
	<link rel="stylesheet" href="static/css/ace-responsive.min.css" />
	<link rel="stylesheet" href="static/css/ace-skins.min.css" />

	<link rel="stylesheet" href="static/css/datepicker.css" /><!-- 日期框 -->
	<script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
	<script type="text/javascript" src="static/js/jquery.tips.js"></script>

	<script type="text/javascript">


		//保存
		function save() {
//			alert("baocun");

			if ($("#USERNAME").val() == "" || $("#USERNAME").val() == "此用户名已存在!") {		//function hasU()
				$("#USERNAME").tips({
					side: 3,
					msg: '请输入学号，用户名',
					bg: '#AE81FF',
					time: 2
				});
				$("#USERNAME").focus();
				$("#USERNAME").val('');
				$("#USERNAME").css("background-color", "white");
				return false;
			} else {
				$("#USERNAME").val(jQuery.trim($('#USERNAME').val()));
			}

			if ($("#NAME").val() == "") {
				$("#NAME").tips({
					side: 3,
					msg: '请输入真实姓名',
					bg: '#AE81FF',
					time: 2
				});
				$("#NAME").focus();
				return false;
			} else {
				$("#NAME").val(jQuery.trim($('#NAME').val()));
			}

			if ($("#PASSWORD").val() == "") {
				$("#PASSWORD").tips({
					side: 3,
					msg: '请输入密码',
					bg: '#AE81FF',
					time: 2
				});
				$("#PASSWORD").focus();
				return false;
			}
			if ($("#PASSWORD").val() != $("#chkpwd").val()) {

				$("#chkpwd").tips({
					side: 3,
					msg: '两次密码不相同',
					bg: '#AE81FF',
					time: 3
				});

				$("#chkpwd").focus();
				return false;
			}

			if ($("#EMAIL").val() == "") {
				$("#EMAIL").tips({
					side: 3,
					msg: '请输入电子邮件',
					bg: '#AE81FF',
					time: 2
				});
				$("#EMAIL").focus();
				return false;
			} else if (!ismail($("#EMAIL").val())) {
				$("#EMAIL").tips({
					side: 3,
					msg: '邮箱格式不正确',
					bg: '#AE81FF',
					time: 3
				});
				$("#EMAIL").focus();
				return false;
			}
			if ($("#QQ").val() == "") {
				$("#QQ").tips({
					side: 3,
					msg: '请输入QQ',
					bg: '#AE81FF',
					time: 2
				});
				$("#QQ").focus();
				return false;
			}
			if ($("#PHONE").val() == "") {
				$("#PHONE").tips({
					side: 3,
					msg: '请输入联系电话',
					bg: '#AE81FF',
					time: 2
				});
				$("#PHONE").focus();
				return false;
			}

			if ($("#ADDR").val() == "") {
				$("#ADDR").tips({
					side: 3,
					msg: '请输入地址',
					bg: '#AE81FF',
					time: 2
				});
				$("#ADDR").focus();
				return false;
			}
			if($("#USER_ID").val() == ""){
				hasU();
			} else{
				$("#Form").submit();
				$("#zhongxin").hide();
				$("#zhongxin2").show();
//				window.location.href="student/list.do";
			}
		}
		function ismail(mail){
			return(new RegExp(/^(?:[a-zA-Z0-9]+[_\-\+\.]?)*[a-zA-Z0-9]+@(?:([a-zA-Z0-9]+[_\-]?)*[a-zA-Z0-9]+\.)+([a-zA-Z]{2,})+$/).test(mail));
		}

		//判断用户名是否存在
		function hasU(){
			var USERNAME = $.trim($("#USERNAME").val());
			$.ajax({
				type: "POST",
				url: '<%=basePath%>student/hasU.do',				//student/hssU.do
				data: {USERNAME:USERNAME,tm:new Date().getTime()},
				dataType:'json',
				cache: false,
				success: function(data){
					if("success" == data.result){
						$("#Form").submit();
//						alert("submit");
						$("#zhongxin").hide();
						$("#zhongxin2").show();
//						window.location.href="student/list.do";
					}else{
						$("#USERNAME").css("background-color","#D16E6C");
						setTimeout("$('#USERNAME').val('此用户名已存在!')",500);
						location.hash="#USERNAME";
						$("#USERNAME").tips({
							side: 3,
							msg: '此用户名已存在',
							bg: '#AE81FF',
							time: 2
						});
					}
				}
			});
		}

		//判断邮箱是否存在
		function hasE(USERNAME){
			var EMAIL = $.trim($("#EMAIL").val());
			$.ajax({
				type: "POST",
				url: '<%=basePath%>student/hasE.do',
				data: {EMAIL:EMAIL,USERNAME:USERNAME,tm:new Date().getTime()},
				dataType:'json',
				cache: false,
				success: function(data){
					if("success" != data.result){
						$("#EMAIL").tips({
							side:3,
							msg:'邮箱已存在',
							bg:'#AE81FF',
							time:3
						});
						setTimeout("$('#EMAIL').val('')",2000);
					}
				}
			});
		}

	</script>


    <script type="text/javascript">
        $(function () {
            $("#DEPARTMENT_ID").change(function () {
                var DEPARTMENT_ID = $("#DEPARTMENT_ID").val();
                $.ajax({
                    type: "POST",//提交方式
					url: '<%=basePath%>student/getNext.do',//获取数据的函数
                    data: {P_BM:DEPARTMENT_ID,tm:new Date().getTime()},//查询条件
                    error: function () {
                        alert("服务器异常")
                    },//查询失败
                    success: function (data) {//查询成功,data为返回的数据
						$("#PROFESSION_ID").empty();//先清除数据
						$("#CLASSES_ID").empty();//先清除数据
//						$("#PROFESSION_ID").append("<option value=''>请选择</option>");//赋值

						$.each(data.tasks, function (index, item) {
							$("#PROFESSION_ID").append("<option value=" + item.BIANMA + ">" + item.NAME + "</option>");//赋值
						});

						var PROFESSION_ID = $("#PROFESSION_ID").val();
						$.ajax({
							type: "POST",//提交方式
							url: '<%=basePath%>student/getNext.do',//获取数据的函数
//                    data: {EMAIL:EMAIL,USERNAME:USERNAME,tm:new Date().getTime()},//查询条件
							data: {P_BM:PROFESSION_ID,tm:new Date().getTime()},//查询条件
							error: function () {
								alert("服务器异常")
							},//查询失败
							success: function (data) {//查询成功,data为返回的数据
								$("#CLASSES_ID").empty();//先清除数据
//						$("#CLASSES_ID").append("<option value=''>请选择</option>");//赋值

								$.each(data.tasks, function (index, item) {
//							$("#PROFESSION_ID").append("<option value='item.BIANMA'>item.NAME</option>");//赋值
									$("#CLASSES_ID").append("<option value=" + item.BIANMA + ">" + item.NAME + "</option>");//赋值
//							alert(index+"  "+item.BIANMA + "  " + item.NAME);
								});
							}
						});
                    }
                });
            });
        });

		$(function () {
			$("#PROFESSION_ID").change(function () {
//				$("#PROFESSION_ID").empty();
//				$("<option  value='1'>1111</option>").appendTo("#PROFESSION_ID")
//				$("#PROFESSION_ID").append("<option value=''>请选择专业</option>");
				var PROFESSION_ID = $("#PROFESSION_ID").val();
				$.ajax({
					type: "POST",//提交方式
					url: '<%=basePath%>student/getNext.do',//获取数据的函数
//                    data: {EMAIL:EMAIL,USERNAME:USERNAME,tm:new Date().getTime()},//查询条件
					data: {P_BM:PROFESSION_ID,tm:new Date().getTime()},//查询条件
					error: function () {
						alert("服务器异常")
					},//查询失败
					success: function (data) {//查询成功,data为返回的数据
						$("#CLASSES_ID").empty();//先清除数据
//						$("#CLASSES_ID").append("<option value=''>请选择</option>");//赋值

						$.each(data.tasks, function (index, item) {
//							$("#PROFESSION_ID").append("<option value='item.BIANMA'>item.NAME</option>");//赋值
							$("#CLASSES_ID").append("<option value=" + item.BIANMA + ">" + item.NAME + "</option>");//赋值
//							alert(index+"  "+item.BIANMA + "  " + item.NAME);
						});
					}
				});
			});
		});


	/*	$(function () {
				var DEPARTMENT_ID = $("#DEPARTMENT_ID").val();
				$.ajax({
					type: "POST",//提交方式
					url: '<%=basePath%>student/getNext.do',//获取数据的函数
					data: {P_BM:DEPARTMENT_ID,tm:new Date().getTime()},//查询条件
					error: function () {
						alert("服务器异常")
					},//查询失败
					success: function (data) {//查询成功,data为返回的数据
						$("#PROFESSION_ID").empty();//先清除数据
						$("#PROFESSION_ID").append("<option value=''></option>");//赋值

						$.each(data.tasks, function (index, item) {
							$("#PROFESSION_ID").append("<option value=" + item.BIANMA + ">" + item.NAME + "</option>");//赋值
						});
					}
				});
		});
*/


	</script>











</head>
<body>
<div align="left" style="padding-top:20px;padding-bottom:10px;padding-left:600px;font-size:20px;font-family:'黑体'">${title}</div>
<form action="student/${msg}.do" name="Form" id="Form" method="post">
	<input type="hidden" name="USER_ID" id="USER_ID" value="${pd.USER_ID}"/>
	<input type="hidden" name="STATUS" id="STATUS" value="${pd.STATUS}"/>
	<input type="hidden" name="SKIN" id="SKIN" value="${pd.SKIN}"/>
	<div id="zhongxin">
		<table id="table_report" class="table table-striped table-bordered table-hover">
			<tr>
				<td style="width:160px;height:35px;text-align: right;padding-top: 7px;">用户名:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input style="width:350px" type="text" name="USERNAME" id="USERNAME" value="${pd.USERNAME}" maxlength="32" placeholder="这里输入学号，用户名" title="学号，用户名"/></td>
			</tr>
			<tr>
				<td style="width:160px;height:35px;text-align: right;padding-top: 7px;">真实姓名:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input style="width:350px" type="text" name="NAME" id="NAME" value="${pd.NAME}" maxlength="32" placeholder="这里输入真实姓名" title="真实姓名"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">密码:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input type="password" style="width:350px" type="text" name="PASSWORD" id="PASSWORD"  maxlength="32" placeholder="这里输入密码" title="密码"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">确认密码:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input type="password" style="width:350px" type="text" name="chkpwd" id="chkpwd"  maxlength="32" placeholder="确认密码" title="密码"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">邮箱:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input style="width:350px" type="text" name="EMAIL" id="EMAIL" value="${pd.EMAIL}" maxlength="32" placeholder="这里输入邮箱" title="邮箱" onblur="hasE('${pd.USERNAME }')"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">QQ:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input style="width:350px" type="text" name="QQ" id="QQ" value="${pd.QQ}" maxlength="32" placeholder="这里输入QQ" title="qq"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">手机号:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input style="width:350px" type="text" name="PHONE" id="PHONE" value="${pd.PHONE}" maxlength="32" placeholder="这里输入手机号" title="手机号"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">性别:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;
					<input name="SEX" type="radio" value="男" checked="checked" /><span class="lbl">男</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<input name="SEX" type="radio" value="女" /><span class="lbl">女</span>
				</td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">地址:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;<input style="width:350px" type="text" name="ADDR" id="ADDR" value="${pd.ADDR}" maxlength="32" placeholder="这里输入地址" title="地址"/></td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">院系:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;
					<select <%--class="chzn-select"--%> style="width:300px" name="DEPARTMENT_ID" id="DEPARTMENT_ID" value="${pd.DEPARTMENT_ID}" data-placeholder="院系...">
						<option value="">请选择</option>
						<c:forEach items="${roleList1}" var="role">
							<option value="${role.BIANMA }" <c:if test="${role.BIANMA == pd.DEPARTMENT_ID }">selected</c:if>>${role.NAME }</option>
						</c:forEach>
					</select>
				</td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">专业:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;
					<select <%--class="chzn-select"--%> style="width:300px" name="PROFESSION_ID" id="PROFESSION_ID" value="${pd.PROFESSION_ID}" data-placeholder="专业...">
						<option value="">请选择</option>
						<c:forEach items="${roleList2}" var="role">
							<option value="${role.BIANMA }" <c:if test="${role.BIANMA == pd.PROFESSION_ID }">selected</c:if>>${role.NAME }</option>
						</c:forEach>

					</select>
				</td>
			</tr>
			<tr>
				<td style="height:35px;width:160px;text-align: right;padding-top: 7px;">班级:</td>
				<td style="height:35px;padding-top: 13px;">&nbsp;&nbsp;&nbsp;&nbsp;
					<select <%--class="chzn-select"--%> style="width:300px" name="CLASSES_ID" id="CLASSES_ID" value="${pd.CLASSES_ID}" data-placeholder="班级...">
						<option value="">请选择</option>
						<c:forEach items="${roleList3}" var="role">
							<option value="${role.BIANMA }" <c:if test="${role.BIANMA == pd.CLASSES_ID }">selected</c:if>>${role.NAME }</option>
						</c:forEach>

					</select>
				</td>
			</tr>
			<tr>
				<td style="text-align: center;height:45px;padding-left: 100px;" colspan="10">
					<a class="btn btn-mini btn-primary" onclick="save();">保存</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					<a class="btn btn-mini btn-danger" onclick="top.Dialog.close();">取消</a>
				</td>
			</tr>
		</table>
	</div>

	<div id="zhongxin2" class="center" style="display:none"><br/><br/><br/><br/><br/><img src="static/images/jiazai.gif" /><br/><h4 class="lighter block green">提交中...</h4></div>

</form>


<!-- 引入 -->
<script type="text/javascript">window.jQuery || document.write("<script src='static/js/jquery-1.9.1.min.js'>\x3C/script>");</script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/ace-elements.min.js"></script>
<script src="static/js/ace.min.js"></script>
<script type="text/javascript" src="static/js/chosen.jquery.min.js"></script><!-- 下拉框 -->
<script type="text/javascript" src="static/js/bootstrap-datepicker.min.js"></script><!-- 日期框 -->
<script type="text/javascript">
	$(top.hangge());
	$(function() {

		//单选框
		$(".chzn-select").chosen();
		$(".chzn-select-deselect").chosen({allow_single_deselect:true});

		//日期框
		$('.date-picker').datepicker();

	});

</script>
</body>
</html>